<template>
	<u-navbar :leftIconSize="42" titleStyle="font-size:20px;font-weight:600" :autoBack="true" :placeholder='true'
		title="提现账号">
	</u-navbar>
  <empty :config="{text: '您还没有提现账号'}" v-if="data.list.length === 0" />
	<view v-else class="padding-30rpx">
		<view class="white-bg" style="border-radius: 8px;font-size: 15px; padding: 0 15px 0 15px">
			<view class="flex-jc-s-b" v-for="(item,index) in data.list"
				style="padding: 15px 0;"
				:style="index!=data.list.length-1?{'border-bottom':'1px solid rgba(0,0,0,0.1)'}:''">
        <view class="flex-column" style="align-items: flex-start;margin-left: 5px;">
          <text style="color: #333333;font-weight: bold;font-size: 15px;font-family: 'PingFang SC',sans-serif;">{{item.name||''}}</text>
          <text style="color: #999999;font-weight: 400;font-size: 12px;font-family: 'PingFang SC',sans-serif;">{{item.account||''}}</text>
        </view>
				<u-icon v-if="data.code === 'edit'" @click="goAddOrEdit('update', item.id)"
					:color="'#939393'" size="40" name="edit-pen"></u-icon>
				<u-radio-group v-else v-model="data.form.id" @change="groupChange(item)">
				  <u-radio shape="circle" :size="32" :label="''" :name="item.id" />
				</u-radio-group>
			</view>
		</view>
	</view>
<!--	<view class="" style="height: 80px;"></view>-->
	<view class="comfig-button flex-center">
		<u-button :customStyle="{'width':'345px'}" type="primary" shape="circle"
              @click="goAddOrEdit('add', '')" text="新增提现账号"></u-button>
	</view>
</template>

<script setup>
	import { reactive } from "vue";
	import { onLoad } from "@dcloudio/uni-app";
  import {accountListApi} from './const'
  import pageRoute from '@/utils/pageRoute'
  import empty from '@/pages/components/empty.vue'
  const data = reactive({
    code: 'edit',
		form: {
			"id": '',
			"account": "",
			"name": ''
		},
		list: []
	})
	onLoad((options) => {
    data.code = options.code || 'edit'
    uni.$on('getWithdrawalAccountList',getWithdrawalAccountList)
    options.id? data.form.id = Number(options.id) : ''
    getWithdrawalAccountList()
	})
  function getWithdrawalAccountList () {
    data.list = []
    initList()
  }
	const initList = () => {
    accountListApi({}).then((res) => {
			data.list = res.rows || []
		})
	}
  const goAddOrEdit = (type, id) => {
    pageRoute.route('pages/withdrawal/account/add-update', {type: type, id: id})
  }
  const groupChange = (item) => {
    data.form.id = item.id
	uni.$emit('selectedAccount',item)
	uni.navigateBack({
		delta: 1
	})
  };
</script>

<style lang="scss" scoped>
	.comfig-button {
		position: fixed;
		width: 100%;
		left: 0;
		bottom: 30px;
	}
</style>
